<script lang="ts" setup>
const props = defineProps<{ title?: string; titleStyle?: any }>();
</script>

<template>
	<view class="x-divider">
		<view class="x-divider-title" v-if="title" :style="titleStyle">{{ title }}</view>
	</view>
</template>

<style lang="scss" scoped>
.x-divider {
	width: 100%;
	display: flex;
	align-items: center;
	margin: 24rpx 0;

	&-title {
		white-space: nowrap;
		padding: 0 20rpx;
		font-size: 24rpx;
	}

	&::before {
		display: block;
		width: 50%;
		content: '';
		height: 1px;
		background-color: #eeeeee;
	}

	&::after {
		display: block;
		width: 50%;
		content: '';
		height: 1px;
		background-color: #eeeeee;
	}
}
</style>
